<%@ page contentType="text/html;charset=UTF-8" %>

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="layout" content="site">
  </head>
  <body>
    <div class="mainbar">
      <div class="article">
        <h2>Nossos Produtos</h2>
        <div class="clr"></div>
        <p>
          Conheça nossa linha de produtos, clique nos links abaixo e veja as 
          fotos de cada categoria.
        </p>
      </div>
      <div style="float: left">
        <g:link controller="principal" action="fotos" id="Aneis">
          <img src="${resource(dir:'images', file:'anel.png')}" />  
          <h2>Aneis</h2>
        </g:link>
      </div>
      <div style="float: right">
        <g:link controller="principal" action="fotos" id="Brincos">
          <img src="${resource(dir:'images', file:'brinco.png')}"/>  
          <h2>Brincos</h2>
        </g:link>
      </div>

      <div style="float: left; margin-top: 150px; margin-left: 30px">
        <g:link controller="principal" action="fotos" id="Pulseiras">
          <img src="${resource(dir:'images', file:'pulseira.png')}" />  
          <h2>Pulseiras</h2>
        </g:link>
      </div>

      <div style="float: right; margin-top: 150px">
        <g:link controller="principal" action="fotos" id="Pingentes">
          <img src="${resource(dir:'images', file:'pingente.png')}"/>  
          <h2>Pingentes</h2>
        </g:link>
      </div>

      <div style="float: left; margin-left: 30px">
        <g:link controller="principal" action="fotos" id="Colares">
          <img src="${resource(dir:'images', file:'colar.png')}"/>  
          <h2>Colares</h2>
        </g:link>
      </div>

    </div>

    <div class="clr"></div>
  </body>
</html>
